<div>
    <div class="row" v-if="appServiceManageInfo.component == 'appServiceManage'">
        <div class="col-md-2 padding-right-0">
            <div class="bg-white treeview">
                <ul class="list-group text-center">
                    <li class="list-group-item node-orgTree " v-for="(item,index) in appServiceManageInfo.asGroups" :class="{'vc-node-selected':appServiceManageInfo.conditions.asGroupId==item.avgId}" @click="swatch(item)">{{item.avgName}}
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-md-10">
            <div class="row" v-if="appServiceManageInfo.component == 'appServiceManage'">
                <div class="col-lg-12">
                    <div class="ibox ">
                        <div class="ibox-title">
                            <h5>查询条件</h5>
                            <div class="ibox-tools" style="top:10px;">

                            </div>
                        </div>
                        <div class="ibox-content">
                            <div class="row">

                                <div class="col-sm-4">
                                    <select class="custom-select" v-model="appServiceManageInfo.conditions.asType">
                                        <option selected value="">请选择服务类型</option>
                                        <option value="001">数据库</option>
                                        <option value="002">缓存</option>
                                        <option value="003">计算应用</option>
                                        <option value="004">代理</option>
                                    </select>
                                </div>
                                <div class="col-sm-3">
                                    <div class="form-group">
                                        <input type="text" placeholder="请输入服务名称" v-model="appServiceManageInfo.conditions.asName" class=" form-control">
                                    </div>
                                </div>
                                <div class="col-sm-4">
                                    <select class="custom-select" v-model="appServiceManageInfo.conditions.state">
                                        <option selected value="">请选择状态</option>
                                        <option value="10012">停止</option>
                                        <option value="10015">运行中</option>
                                    </select>
                                </div>
                                <div class="col-sm-1">
                                    <button type="button" class="btn btn-primary btn-sm" v-on:click="_queryAppServiceMethod()">
                                        <i class="glyphicon glyphicon-search"></i> 查询
                                    </button>
                                </div>
                            </div>


                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox">
                        <div class="ibox-title">
                            <h5>应用服务</h5>
                            <div class="ibox-tools" style="top:10px;">
                                <button type="button" class="btn btn-white btn-sm" v-on:click="_restartMoreApps()">
                                    一键重启
                                </button>
                                <button type="button" class="btn btn-white btn-sm" v-on:click="_openAddAppServiceModal()">
                                    添加服务
                                </button>
                                <button type="button" class="btn btn-white btn-sm" v-on:click="_openFasterDeploy()">
                                    快速部署
                                </button>
                                <button type="button" class="btn btn-white btn-sm" v-on:click="_importYaml()">
                                    导入
                                </button>
                                <button type="button" class="btn btn-white btn-sm" v-on:click="_exportYaml()">
                                    导出
                                </button>
                            </div>
                        </div>
                        <div class="ibox-content">

                            <table class="footable table table-stripped toggle-arrow-tiny" data-page-size="15">
                                <thead>
                                    <tr>
                                        <!-- <th class="text-center">应用组</th> -->
                                        <th class="text-center">服务类型</th>
                                        <th class="text-center">应用名称</th>

                                        <th class="text-center">副本数</th>
                                        <th class="text-center">镜像</th>
                                        <th class="text-center">创建时间</th>
                                        <th class="text-center">状态</th>
                                        <th class="text-center">操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr v-for="appService in appServiceManageInfo.appServices">
                                        <!-- <td class="text-center">{{appService.avgName}}</td> -->
                                        <td class="text-center">{{appService.asTypeName}}</td>
                                        <td class="text-center">{{appService.asName}}</td>

                                        <td class="text-center">{{appService.asCount}}</td>
                                        <td class="text-center">{{appService.imagesName}}:{{appService.imagesVersion}}
                                        </td>
                                        <td class="text-center">{{vc.formatUTCTime(appService.createTime)}}</td>
                                        <td class="text-center" style="color: #FFF;">
                                            <span class="badge bg-success" v-if="appService.state == '10015'">
                                                {{appService.stateName}}</span>
                                            <span class="badge bg-warning" v-else-if="appService.state == '10014'">
                                                {{appService.stateName}}</span>
                                            <span class="badge bg-danger" v-else> {{appService.stateName}}</span>
                                        </td>
                                        <td class="text-center">
                                            <div class="btn-group">
                                                <button class="btn-white btn btn-xs" v-on:click="_openControl(appService)">控制台</button>
                                            </div>
                                            <div class="btn-group">
                                                <button class="btn-white btn btn-xs" v-on:click="_upgradeAppService(appService)">升降</button>
                                            </div>
                                            <div class="btn-group" v-if="appService.state == '10012'">
                                                <button class="btn-white btn btn-xs" v-on:click="_startAppService(appService)">启动</button>
                                            </div>
                                            <div class="btn-group" v-else>
                                                <button class="btn-white btn btn-xs" v-on:click="_stopAppService(appService)">停止</button>
                                            </div>
                                            <div class="btn-group">
                                                <button class="btn-white btn btn-xs" v-on:click="_copyAppService(appService)">拷贝</button>
                                            </div>
                                            <div class="btn-group" v-if="appService.state == '10012'">
                                                <button class="btn-white btn btn-xs" v-on:click="_openDeleteAppServiceModel(appService)">删除</button>
                                            </div>
                                            <div class="btn-group" v-if="appService.state != '10012'">
                                                <button class="btn-white btn btn-xs" v-on:click="_openDockerLog(appService)">日志</button>
                                            </div>
                                        </td>

                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="7">
                                            <ul class="pagination float-right"></ul>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                            <!-- 分页 -->
                            <vc:create path="frame/pagination"></vc:create>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <div v-if="appServiceManageInfo.component == 'addAppService'">
        <vc:create path="admin/addAppService" callBackListener="" callBackFunction=""></vc:create>
    </div>
    <vc:create path="admin/copyAppService"></vc:create>
    <vc:create path="admin/deleteAppService"></vc:create>
    <vc:create path="admin/selectAppService"></vc:create>
    <vc:create path="admin/importAppService"></vc:create>
    <vc:create path="admin/upgradeAppService"></vc:create>
    <vc:create path="admin/chooseHostContainer"></vc:create>

</div>